{% extends "templates/base.phtml" %}
{%block content%}
{% if wxc is defined %}
<!-- PAGE CONTENT WRAPPER -->

<div class="page-content-wrap">
    <div class="row">
        <div class="col-md-12">
            <div class="panel panel-default tabs">
                <ul class="nav nav-tabs" role="tablist">
                    <li><a href="/admin/appvote">投票列表</a></li>
                    <li class="active"><a href="/admin/appvote">修改投票</a></li>
                </ul>
                <div class="panel-body tab-content">
                    <div class="tab-pane active">
                        <div class="col-md-12">
                            <h3>修改投票</h3>
                            <div class="col-md-2 col-xs-2 pull-right">
                                <a class="btn btn-success back" href="/admin/appvote">返回</a>
                            </div>
                            <div class="form-horizontal">
                                <div class="panel panel-default">
                                    <div class="panel-body def-pan-bd">
                                        <div class="col-bd col-md-12 col-xs-12">
                                            <div class="col-md-12 form-horizontal">
                                                <!-- 新建投票-->
                                                <form class="form-horizontal" method="post">

                                                    <div class="form-group">
                                                        <label class="col-md-3 col-xs-12 control-label">标题：</label>
                                                        <div class="col-md-6 col-xs-12">
                                                            <div class="input-group">
                                                                <span class="input-group-addon"><span class="fa fa-pencil"></span></span>
                                                                <input name="name" type="text" class="form-control" value="{{vote.name}}">
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <div class="form-group">
                                                        <label class="col-md-3 col-xs-12 control-label">封面图片：</label>
                                                        <div class="col-md-6 col-xs-12">
                                                            <input class="J-fileup" id="fileup" name="fileup"
                                                                   type="file" multiple="true">
                                                            <input id="pic" name="pic" class="form-control"
                                                                   type="hidden" value="{{vote.pic}}">
                                                            <img id="thumb" src="{{vote.pic}}" style="max-height: 200px;max-width: 200px">
                                                        </div>
                                                    </div>

                                                    <div class="form-group">
                                                        <label class="col-md-3 col-xs-12 control-label">详情：</label>
                                                        <div class="col-md-6 col-xs-12">
                                                            <textarea id="detail" name="detail" class="form-control">{{vote.detail}}</textarea>
                                                        </div>
                                                    </div>

                                                    <div class="form-group">
                                                        <label class="col-md-3 col-xs-12 control-label">截止时间：</label>
                                                        <div class="col-md-6 col-xs-12">
                                                            <div class="input-group">
                                                                <span class="input-group-addon"><span class="fa fa-calendar"></span></span>
                                                                <input name="time_end" type="text" class="form-control datepicker" value="{{vote.time_end}}">
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <div class="form-group">
                                                        <label class="col-md-3 col-xs-12 control-label">选择类型：</label>
                                                        <div class="col-md-6 col-xs-12">

                                                            <div class="checkbox">
                                                                <input type="radio" value="1" id="type_0" class="regular-radio" name="type"   {%if vote.type==1%}checked{%endif%} >
                                                                <label for="type_0">"单选"     </label>
                                                            </div>

                                                            <div class="checkbox">
                                                                <input type="radio" value="2" id="type_1" class="regular-radio" name="type"  {%if vote.type==2%}checked{%endif%}>
                                                                <label for="type_1">"多选"</label>
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <div class="form-group">
                                                        <label class="col-md-3 col-xs-12 control-label">文字/图片投票：</label>
                                                        <div class="col-md-6 col-xs-12">
                                                            <select class="J-state" id="state" name="state"> <option  value="1" {%if vote.state==1%}selected{%endif%}>文字投票</option> <option value="2" {%if vote.state==2%}selected{%endif%}>图片投票</option> </select>
                                                        </div>
                                                    </div>

                                                    <a>选项</a>
                                                    <table class="table table-bordered">
                                                        <thead>
                                                        <tr>
                                                            <th id="option_pic_words"style=" {%if vote.state==1%}display: none{%else%}display: table-cell{%endif%}">图片</th>
                                                            <th>排序</th>
                                                            <th>标题</th>
                                                            <th>描述</th>
                                                            <th>操作</th>
                                                        </tr>
                                                        </thead>
                                                        <tbody class="J-tbody">
                                                        {% for voteOption in voteOptions%}
                                                        <tr class="J-tr">
                                                            <td class="J-pic" name="option_pic"style="height:40px;width:120px; {%if vote.state==1%}display: none{%else%}display: table-cell{%endif%}">

                                                                <input class="J-fileup2"  id="fileup{{voteOption.order}}" type="file" multiple="true" >
                                                                <input id ="pic{{voteOption.order}}"name="option_pic[]" class="form-control"  type="hidden"value="{{voteOption.pic}}" >
                                                                <div style="height:120px;width:120px ;  ">
                                                                    <img src="{{voteOption.pic}}" style="overflow: hidden;max-height: 120px;max-width:120px;"/>
                                                                </div>
                                                            </td>
                                                            <input name="idNum[]" value="{{voteOption.id}}" type="hidden">
                                                            <td>
                                                                <input name="order[]" type="hidden" class="form-control" value="{{voteOption.order}}">
                                                                <p>{{voteOption.order}}</p>
                                                            </td>
                                                            <td><input name="option_name[]" type="text" class="form-control"value="{{voteOption.option}}"> </td>
                                                            <td><textarea name="option_detail[]" class="form-control" style="resize:vertical">{{voteOption.detail}}</textarea></td>
                                                            <td>
<!--                                                                <button class="btn btn-danger J-save">提交</button>-->
                                                                <button type="button" class="btn btn-danger "onclick="deleteConfirm({{voteOption.id}});">删除</button>
                                                            </td>
                                                        </tr>
                                                        {%endfor%}

                                                        </tbody>

                                                    </table>

                                                    <div class="form-group">
                                                        <label class="col-md-3 col-xs-12 control-label">&nbsp;</label>
                                                        <a class="btn btn-success J-add" >增加</a>
                                                    </div>

                                                    <div class="form-group col-md-12">
                                                        <div class="col-md-6 col-xs-12 col-md-offset-4">
                                                            <button class="btn btn-primary " >提交</button>
                                                        </div>
                                                    </div>

                                                </form>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{%endif%}
{%endblock%}
{%block end%}


<style>
    .add{
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px
    }
</style>


<script src="/assets/uploadify/jquery.uploadify.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="/assets/uploadify/uploadify.css">
<script type="text/javascript">



    $(function() {
        $(".J-fileup").uploadify({
            'formData'     : {
            },
            'swf'      : '/assets/uploadify/uploadify.swf',
            'uploader' : '/admin/resource/upload',
            'cancelImg': '/assets/uploadify/uploadify-cancel.png',//单个取消上传的图片
            'onUploadSuccess': function (file, data, response) {
                var data = JSON.parse(data);
                if (data.status == 1) {
                    $('#pic').val(data.data);
                    $('#pic').val(data.data);
                    $('#thumb').attr("src",data.data);
                    $('#thumb').css("display","block");
                }

            }
        });
    });



</script>
<script>

        $(".J-fileup2").each(function(){
        $(this).uploadify({
            'formData'     : {
            },
            'swf'      : '/assets/uploadify/uploadify.swf',
            'uploader' : '/admin/resource/upload',
            'cancelImg': '/assets/uploadify/uploadify-cancel.png',//单个取消上传的图片
            'onUploadSuccess': function (file, data, response) {
                var data = JSON.parse(data);
                if (data.status == 1) {
                    var btn=$(this)['0']['button']['0'];
                    var Sbtn=btn.getAttribute("id");
                    var indexEnd=Sbtn.indexOf("-button");
                    var idStr=Sbtn.substr(0,indexEnd);
                    document.getElementById(idStr).nextElementSibling.nextElementSibling.value=data.data; //set value to pic[]
                    $('#'+idStr).next().next().next().children().attr("src",data.data);
                    $('#'+idStr).next().next().next().children().css("display","block");
                }

            }

        });
    });
</script>


<script type="application/javascript">
    var count={{voteCount}};
    //添加、删除
    $(document).ready(function(){


        //改变
        $(".J-state").click(function(){
            var state= document.getElementById("state").value;
            if(state==1)
            {
                document.getElementById("option_pic_words").style.display="none";
                var pics=document.getElementsByClassName("J-pic");
                for(var i=0;i<pics.length;++i)
                {
                    pics[i].style.display="none";
                }
            }
            else  if(state==2){
                document.getElementById("option_pic_words").style.display='table-cell';

                var pics2=document.getElementsByClassName("J-pic");
                for(var j=0;j<pics2.length;++j)
                {
                    pics2[j].style.display="table-cell";
                }
            }
        });



        //添加
        $(".J-add").click(function(){
            count++;
            var state= document.getElementById("state").value;
            var disp;
            if(state==1){disp="none";}
            else if(state==2){disp="table-cell";}
            option= '<tr class="J-tr"><td class="J-pic" name="option_pic"style="height:120px;width:120px;display: '+disp+'"> <input class="J-fileup2"  id="fileup'+count+'" type="file" multiple="true" > <input id ="pic'+count+'"name="option_pic[]" class="form-control"  type="hidden" ><div style="height:120px;width:120px ;  "><img id="preview' + count +' " src="" style="max-height: 120px;max-width: 120px"> </div></td> <td><input name="idNum[]"  type="hidden"><input name="order[]" type="hidden" class="form-control" value="'+count+'"><p>'+count+'</p></td> <td><input name="option_name[]" type="text" class="form-control"> </td><td><textarea name="option_detail[]" class="form-control" style="resize:vertical"></textarea></td><td> <button class="btn btn-danger J-delete">删除</button> </td> </tr>';
            $(".J-tbody").append(option);

            $(".J-fileup2").uploadify({
                'formData': {},
                'swf': '/assets/uploadify/uploadify.swf',
                'uploader': '/admin/resource/upload',
                'cancelImg': '/assets/uploadify/uploadify-cancel.png',//单个取消上传的图片
                'onUploadSuccess': function (file, data ,response) {
                    var data = JSON.parse(data);
                    if (data.status == 1) {
                        var btn=$(this)['0']['button']['0'];
                        var Sbtn=btn.getAttribute("id");
                        var indexEnd=Sbtn.indexOf("-button");
                        var idStr=Sbtn.substr(0,indexEnd);
                        document.getElementById(idStr).nextElementSibling.nextElementSibling.value=data.data; //set value to pic[]
                        $('#'+idStr).next().next().next().children().attr("src",data.data);
                        $('#'+idStr).next().next().next().children().css("display","block");
                    }
                }
            });

        });


        //删除
        $("body").on("click",".J-delete",function(){
            count--;
            $(this).parent().parent().remove();
        });

    });
</script>

<script type="text/javascript">
    function deleteConfirm(delete_id){
        noty({
            text: '确定要删除此活动么?',
            layout: 'topRight',
            buttons: [
                {addClass: 'btn btn-success btn-clean', text: '确定', onClick: function($noty) {
                    $noty.close();
                    $.post('/admin/appvote/deleteoption/'+delete_id,{},function(result){


                        noty({text: '删除成功', layout: 'topRight', type: 'success'}
                        );location.reload();
                    });
                }
                },
                {addClass: 'btn btn-danger btn-clean', text: '取消', onClick: function($noty) {
                    $noty.close();
                }
                }
            ]
        })
    }
</script>


{%endblock%}